import React, { Component } from 'react'

export default class User extends Component {
  //类组件中state统一存储到了实例对象的state属性中，可以通过this.state来访问，通过this.setState()对其进行修改,此时React只会修改设置了的属性，没有设置的属性会保留原来的值（对于对象状态中的属性不适用）。
  //state必须是个对象
  state = {
    count: 0,
  }
  //响应函数是以类的方法来定义
  clickHandler = () => {
    this.setState({ count: this.state.count + 1 })
  }
  //获取dom对象
  divRef=React.createRef()

  render() {
    return (
      <div ref={this.divRef}>
        User
        {/* 类组件的props是存储在类的实例对象中，可以直接通过实例对象访问 this.props */}
        <button onClick={this.clickHandler}>点我count+1</button>
        <span>{this.props.name}</span>
        <span>{this.props.age}</span>
        <span>{this.state.count}</span>
      </div>
    )
  }
}
